<template>
    <div @click="money += 1000">我的工资 {{ money }}</div>
</template>

<script setup>
import { onMounted, onUnmounted, onUpdated, ref } from 'vue';
// 可以有多个相同的生命周期，会依次执行
// 组合式的写法，业务会放一起

const money = ref(10000)
onUpdated(() => {
    console.log('onUpdated了money');
})

const count = ref(0)
onUpdated(() => {
    console.log('onUpdated了count');
})


onMounted(() => {
    console.log('onMounted周期1');
})
onMounted(() => {
    console.log('onMounted周期2');
})
onMounted(() => {
    console.log('onMounted周期3');
})


onUpdated(() => {
    console.log('onUpdated周期2');
})

onUnmounted(() => {
    console.log('onUnmounted周期');
})


</script>